@import '../variable/color.scss';
@import '../variable/dimen.scss';

@mixin border($direction:all,$color:$lineColorDefault){
    @if $direction==top{
        border-top:$borderWidth solid $color;
    }
    @else if $direction==bottom{
        border-bottom: $borderWidth solid $color;
    }
    @else if $direction==left{
        border-left: $borderWidth solid $color;
    }
    @else if $direction==right{
        border-right: $borderWidth solid $color;
    }
    @else if $direction==all{
        border: $borderWidth solid $color;
    }
}

@mixin topLine($color: $lineColorDefault) {
    content: " ";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    height: 1px;
    border-top: 1px solid $color;
    color: $color;
    transform-origin: 0 0;
    transform: scaleY(0.5);
}

@mixin bottomLine($color: $lineColorDefault) {
    content: " ";
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    height: 1px;
    border-bottom: 1px solid $color;
    color: $color;
    transform-origin: 0 100%;
    transform: scaleY(0.5);
}

@mixin leftLine($color: $lineColorDefault) {
    content: " ";
    position: absolute;
    left: 0;
    top: 0;
    width: 1px;
    bottom: 0;
    border-left: 1px solid $color;
    color: $color;
    transform-origin: 0 0;
    transform: scaleX(0.5);
}

@mixin rightLine($color: $lineColorDefault) {
    content: " ";
    position: absolute;
    right: 0;
    top: 0;
    width: 1px;
    bottom: 0;
    border-right: 1px solid $colorc;
    color: $color;
    transform-origin: 100% 0;
    transform: scaleX(0.5);
}